<template>
    <div class="app-container">
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
            <el-form-item label="姓名" prop="fullName">
                <el-input v-model="queryParams.fullName" placeholder="请输入姓名" clearable @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="部门" prop="department">
                <el-input v-model="queryParams.department" placeholder="请输入部门" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="岗位" prop="position">
                <el-input v-model="queryParams.position" placeholder="请输入岗位" clearable @keyup.enter.native="handleQuery" />
            </el-form-item>
            <!-- <el-form-item label="年龄" prop="age">
                <el-input v-model="queryParams.age" placeholder="请输入年龄" clearable @keyup.enter.native="handleQuery" />
            </el-form-item> -->
            <el-form-item label="性别" prop="gender">
                <el-input v-model="queryParams.gender" placeholder="请输入性别" clearable @keyup.enter.native="handleQuery" />
            </el-form-item>
            <!-- <el-form-item label="民族" prop="ethnicity">
                <el-input v-model="queryParams.ethnicity" placeholder="请输入民族" clearable @keyup.enter.native="handleQuery" />
            </el-form-item> -->
            <el-form-item label="身份证号码" prop="idNumber">
                <el-input v-model="queryParams.idNumber" placeholder="请输入身份证号码" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="身份证家庭地址" prop="homeAddress">
                <el-input v-model="queryParams.homeAddress" placeholder="请输入身份证家庭地址" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="实际居住地" prop="residentialAddress">
                <el-input v-model="queryParams.residentialAddress" placeholder="请输入实际居住地" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="联系电话" prop="contactNumber">
                <el-input v-model="queryParams.contactNumber" placeholder="请输入联系电话" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="紧急联系人" prop="emergencyContactPerson">
                <el-input v-model="queryParams.emergencyContactPerson" placeholder="请输入紧急联系人" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="紧急联系电话" prop="emergencyContactNumber">
                <el-input v-model="queryParams.emergencyContactNumber" placeholder="请输入紧急联系电话" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="学历" prop="education">
                <el-input v-model="queryParams.education" placeholder="请输入学历" clearable @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="专业" prop="major">
                <el-input v-model="queryParams.major" placeholder="请输入专业" clearable @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="农村医保" prop="ruralMedicalInsurance">
                <el-input v-model="queryParams.ruralMedicalInsurance" placeholder="请输入是否缴纳农村医疗保险" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="是否住宿" prop="accommodation">
                <el-input v-model="queryParams.accommodation" placeholder="请输入是否住宿" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>

            <!-- <el-form-item label="二次入职情况" prop="secondemployment">
                <el-input v-model="queryParams.secondemployment" placeholder="请输入二次入职情况" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item> -->

            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>

        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
                    v-hasPermi="['business:talentpool:add']">新增</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
                    v-hasPermi="['business:talentpool:edit']">修改</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
                    v-hasPermi="['business:talentpool:remove']">删除</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
                    v-hasPermi="['business:talentpool:export']">导出</el-button>
            </el-col>
            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>

        <el-table v-loading="loading" :data="talentpoolList" @selection-change="handleSelectionChange" border>
            <el-table-column type="selection" width="55" align="center" />
            <!-- <el-table-column label="id" align="center" prop="id" v-if="true" /> -->
            <el-table-column label="姓名" align="center" prop="fullName" />
            <el-table-column label="部门" align="center" prop="department" />
            <el-table-column label="岗位" align="center" prop="position" />
            <el-table-column label="年龄" align="center" prop="age" />
            <el-table-column label="性别" align="center" prop="gender" />
            <el-table-column label="民族" align="center" prop="ethnicity" />
            <el-table-column label="身份证号码" align="center" prop="idNumber" />
            <el-table-column label="身份证家庭地址" align="center" prop="homeAddress" />
            <el-table-column label="实际居住地" align="center" prop="residentialAddress" />
            <el-table-column label="联系电话" align="center" prop="contactNumber" />
            <!-- <el-table-column label="紧急联系人" align="center" prop="emergencyContactPerson" />
            <el-table-column label="紧急联系电话" align="center" prop="emergencyContactNumber" /> -->
            <el-table-column label="学历" align="center" prop="education" />
            <el-table-column label="专业" align="center" prop="major" />
            <el-table-column label="农村医保" align="center" prop="ruralMedicalInsurance" />
            <el-table-column label="住宿" align="center" prop="accommodation" />
            <el-table-column label="二次入职情况" align="center" prop="secondemployment" />
            <!-- <el-table-column label="头像地址" align="center" prop="img" />
            <el-table-column label="备注" align="center" prop="remarks" /> -->
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150px">
                <template slot-scope="scope">
                    <el-button size="mini" type="text" icon="el-icon-position" @click="handleBecome(scope.row)"
                        v-hasPermi="['business:talentpool:become']">转入</el-button>
                    <el-dropdown>
                        <span class="el-dropdown-link" style="color:#1890ff;">
                            更多<i class="el-icon-arrow-down el-icon--right"></i>
                        </span>
                        <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item> <el-button size="mini" type="text" icon="el-icon-more"
                                    @click="handleDetail(scope.row)"
                                    v-hasPermi="['business:talentpool:detail']">详情</el-button></el-dropdown-item>
                            <el-dropdown-item> <el-button size="mini" type="text" icon="el-icon-edit"
                                    @click="handleUpdate(scope.row)"
                                    v-hasPermi="['business:talentpool:edit']">修改</el-button></el-dropdown-item>
                            <el-dropdown-item> <el-button size="mini" type="text" icon="el-icon-delete"
                                    @click="handleDelete(scope.row)"
                                    v-hasPermi="['business:talentpool:remove']">删除</el-button></el-dropdown-item>

                        </el-dropdown-menu>
                    </el-dropdown>

                </template>
            </el-table-column>
        </el-table>

        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
            @pagination="getList" />

        <!-- 添加或修改员工对话框 -->
        <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
            <el-form ref="form" :model="form" :rules="rules" label-width="120px">
                <el-form-item label="姓名" prop="fullName">
                    <el-input v-model="form.fullName" placeholder="请输入姓名" />
                </el-form-item>
                <el-form-item label="部门" prop="department">
                    <el-input v-model="form.department" placeholder="请输入部门" />
                </el-form-item>
                <el-form-item label="岗位" prop="position">
                    <el-input v-model="form.position" placeholder="请输入岗位" />
                </el-form-item>
                <el-form-item label="年龄" prop="age">
                    <el-input v-model="form.age" placeholder="请输入年龄" />
                </el-form-item>
                <el-form-item label="性别" prop="gender">
                    <el-input v-model="form.gender" placeholder="请输入性别" />
                </el-form-item>
                <el-form-item label="民族" prop="ethnicity">
                    <el-input v-model="form.ethnicity" placeholder="请输入民族" />
                </el-form-item>
                <el-form-item label="身份证号码" prop="idNumber">
                    <el-input v-model="form.idNumber" placeholder="请输入身份证号码" />
                </el-form-item>
                <el-form-item label="身份证家庭地址" prop="homeAddress">
                    <el-input v-model="form.homeAddress" placeholder="请输入身份证家庭地址" />
                </el-form-item>
                <el-form-item label="实际居住地" prop="residentialAddress">
                    <el-input v-model="form.residentialAddress" placeholder="请输入实际居住地" />
                </el-form-item>
                <el-form-item label="联系电话" prop="contactNumber">
                    <el-input v-model="form.contactNumber" placeholder="请输入联系电话" />
                </el-form-item>
                <el-form-item label="紧急联系人" prop="emergencyContactPerson">
                    <el-input v-model="form.emergencyContactPerson" placeholder="请输入紧急联系人" />
                </el-form-item>
                <el-form-item label="紧急联系电话" prop="emergencyContactNumber">
                    <el-input v-model="form.emergencyContactNumber" placeholder="请输入紧急联系电话" />
                </el-form-item>
                <el-form-item label="学历" prop="education">
                    <el-input v-model="form.education" placeholder="请输入学历" />
                </el-form-item>
                <el-form-item label="专业" prop="major">
                    <el-input v-model="form.major" placeholder="请输入专业" />
                </el-form-item>
                <el-form-item label="是否缴纳农村医疗保险" prop="ruralMedicalInsurance">
                    <el-input v-model="form.ruralMedicalInsurance" placeholder="请输入是否缴纳农村医疗保险" />
                </el-form-item>
                <el-form-item label="是否住宿" prop="accommodation">
                    <el-input v-model="form.accommodation" placeholder="请输入是否住宿" />
                </el-form-item>

                <el-form-item label="二次入职情况" prop="secondemployment">
                    <el-input v-model="form.secondemployment" placeholder="请输入二次入职情况" />
                </el-form-item>
                <el-divider content-position="left">受教情况</el-divider>
            <el-row style="background-color: aliceblue;">
                <el-form-item label="受教时间" prop="educationtime1">
                    <el-input v-model="form.educationtime1" placeholder="受教1年月,格式2010.9-2013.7" />
                </el-form-item>
                <el-form-item label="学校名称" prop="school1">
                    <el-input v-model="form.school1" placeholder="请输入学校1名称" />
                </el-form-item>
                <el-form-item label="主要表现" prop="performance1">
                    <el-input v-model="form.performance1" placeholder="请输入主要表现1" />
                </el-form-item>
            </el-row>
            <el-row style="background-color: azure;">
                <el-form-item label="受教时间"  prop="educationtime2">
                    <el-input v-model="form.educationtime2" placeholder="受教2年月,格式2010.9-2013.7" />
                </el-form-item>
                <el-form-item label="学校名称" prop="school2">
                    <el-input v-model="form.school2" placeholder="请输入学校2名称" />
                </el-form-item>
                <el-form-item label="主要表现" prop="performance2">
                    <el-input v-model="form.performance2" placeholder="请输入主要表现2" />
                </el-form-item>
            </el-row>
            <el-row style="background-color: aliceblue;">
                <el-form-item label="受教时间" prop="educationtime3">
                    <el-input v-model="form.educationtime3" placeholder="受教3年月,格式2010.9-2013.7" />
                </el-form-item>
                <el-form-item label="学校名称" prop="school3">
                    <el-input v-model="form.school3" placeholder="请输入学校3名称" />
                </el-form-item>
                <el-form-item label="主要表现" prop="performance3">
                    <el-input v-model="form.performance3" placeholder="请输入主要表现3" />
                </el-form-item>
            </el-row>
            <el-divider content-position="left">工作经验</el-divider>
            <el-row style="background-color: azure;">
                <el-form-item label="工作起止" prop="worktime1">
                    <el-input v-model="form.worktime1" placeholder="工作1起止日期,格式2010.9-2013.7" />
                </el-form-item>
                <el-form-item label="公司名称" prop="company1">
                    <el-input v-model="form.company1" placeholder="请输入公司1名称" />
                </el-form-item>
                <el-form-item label="职位" prop="position1">
                    <el-input v-model="form.position1" placeholder="请输入职位1" />
                </el-form-item>
                <el-form-item label="离职原因" prop="leavereason1">
                    <el-input v-model="form.leavereason1" placeholder="请输入离职原因1" />
                </el-form-item>
            </el-row>
            <el-row style="background-color: aliceblue;">
                <el-form-item label="工作起止" prop="worktime2">
                    <el-input v-model="form.worktime2" placeholder="工作2起止日期,格式2010.9-2013.7" />
                </el-form-item>
                <el-form-item label="公司名称" prop="company2">
                    <el-input v-model="form.company2" placeholder="请输入公司2名称" />
                </el-form-item>
                <el-form-item label="职位" prop="position2">
                    <el-input v-model="form.position2" placeholder="请输入职位2" />
                </el-form-item>
                <el-form-item label="离职原因" prop="leavereason2">
                    <el-input v-model="form.leavereason2" placeholder="请输入离职原因2" />
                </el-form-item>
            </el-row>
            <el-row style="background-color: azure;">
                <el-form-item label="工作起止" prop="worktime3">
                    <el-input v-model="form.worktime3" placeholder="工作3起止日期,格式2010.9-2013.7" />
                </el-form-item>
                <el-form-item label="公司名称" prop="company3">
                    <el-input v-model="form.company3" placeholder="请输入公司3名称" />
                </el-form-item>
                <el-form-item label="职位" prop="position3">
                    <el-input v-model="form.position3" placeholder="请输入职位3" />
                </el-form-item>
                <el-form-item label="离职原因" prop="leavereason3">
                    <el-input v-model="form.leavereason3" placeholder="请输入离职3原因" />
                </el-form-item>
            </el-row>
         
                <el-form-item label="备注" prop="remarks">
                    <el-input v-model="form.remarks" placeholder="请输入备注" />
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
        </el-dialog>
        <!-- 转正对话框 -->
        <el-dialog title="转入" :visible.sync="becomeopen" width="500px" append-to-body>
            <el-form ref="becomeform" :model="becomeform" label-width="120px">
                <el-form-item label="是否外包" prop="outsource">
                    <el-select v-model="becomeform.outsource" placeholder="请选择">
                        <el-option label="否" value="否"></el-option>
                        <el-option label="是" value="是"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button :loading="buttonLoading" type="primary" @click="submitbecomeForm">确 定</el-button>
            </div>
        </el-dialog>
        <!-- 详情 -->
        <el-dialog title="详情" :visible.sync="detailopen" width="1200px" append-to-body>

            <el-image style="width: 100px; height: 100px;float: right;" :src="`http://112.4.224.59:8010${detailform.img}`"
                            fit="fill"></el-image>
            <table class="table">
                <tr>
                    <td style="color: #808080;">姓名</td>
                    <td class="bold-text">{{ detailform.fullName }}</td>
                    <td style="color: #808080;">性别</td>
                    <td class="bold-text">{{ detailform.gender }}</td>
                    <td style="color: #808080;">年龄</td>
                    <td class="bold-text">{{ detailform.age }}</td>
                </tr>
        
                <tr>
                    <td style="color: #808080;">民族</td>
                    <td class="bold-text">{{ detailform.ethnicity }}</td>
                    <td style="color: #808080;">学历</td>
                    <td class="bold-text">{{ detailform.education }}</td>
                    <td style="color: #808080;">专业</td>
                    <td class="bold-text" > {{ detailform.major }}</td>
                </tr>
                <tr>
                    <td style="color: #808080;">身份证号码</td>
                    <td class="bold-text" colspan="2">{{ detailform.idNumber }}</td>
                    <td style="color: #808080;">联系电话</td>
                    <td class="bold-text" colspan="2">{{ detailform.contactNumber }}</td>

                </tr>
                <tr>
                    <td style="color: #808080;">身份证地址</td>
                    <td class="bold-text" colspan="2">{{ detailform.homeAddress }}</td>
                    <td style="color: #808080;">实际居住地</td>
                    <td class="bold-text" colspan="2">{{ detailform.residentialAddress }}</td>

                </tr>
                <tr>
                    <td style="color: #808080;">紧急联系人</td>
                    <td class="bold-text" colspan="2">{{ detailform.emergencyContactPerson }}</td>
                    <td style="color: #808080;">紧急联系电话</td>
                    <td class="bold-text" colspan="2">{{ detailform.emergencyContactNumber }}</td>
                </tr>
                <tr>
                    <td style="color: #808080;">部门</td>
                    <td class="bold-text">{{ detailform.department }}</td>
                    <td style="color: #808080;">岗位</td>
                    <td class="bold-text">{{ detailform.position }}</td>
                    <td style="color: #808080;">二次入职情况</td>
                    <td class="bold-text" >{{ detailform.secondemployment }}</td>

                </tr>
                <tr>

                    <td style="color: #808080;">是否缴纳农村医疗保险</td>
                    <td class="bold-text" colspan="2">{{ detailform.ruralMedicalInsurance }}</td>
                    <td style="color: #808080;">是否住宿</td>
                    <td class="bold-text" colspan="2">{{ detailform.accommodation }}</td>
                </tr>
                <tr>
                    <td colspan="6"><strong>受教育情况</strong></td>
                </tr>
                <tr style="background-color: #f2f2f2;">
                    <td>起止日期</td>
                    <td colspan="2">学校名称</td>
                    <td colspan="3">主要表现</td>
                </tr>
                <tr>
                    <td>{{ detailform.educationtime1 }}</td>
                    <td colspan="2">{{ detailform.school1 }}</td>
                    <td colspan="3">{{ detailform.performance1 }}</td>
                </tr>
                <tr>
                    <td>{{ detailform.educationtime2 }}</td>
                    <td colspan="2">{{ detailform.school2 }}</td>
                    <td colspan="3">{{ detailform.performance2 }}</td>
                </tr>
                <tr>
                    <td>{{ detailform.educationtime3 }}</td>
                    <td colspan="2">{{ detailform.school3 }}</td>
                    <td colspan="3">{{ detailform.performance3 }}</td>
                </tr>
                <tr>
                    <td colspan="6"><strong>工作经验</strong></td>
                </tr>
                <tr style="background-color: #f2f2f2;">
                    <td>起止日期</td>
                    <td>公司名称</td>
                    <td>职位</td>
                    <td colspan="4">离职原因</td>
                </tr>
                <tr>
                    <td>{{ detailform.worktime1 }}</td>
                    <td>{{ detailform.company1 }}</td>
                    <td>{{ detailform.position1 }}</td>
                    <td colspan="4">{{ detailform.leavereason1 }}</td>
                </tr>
                <tr>
                    <td>{{ detailform.worktime2 }}</td>
                    <td>{{ detailform.company2 }}</td>
                    <td>{{ detailform.position2 }}</td>
                    <td colspan="4">{{ detailform.leavereason2 }}</td>
                </tr>
                <tr>
                    <td>{{ detailform.worktime3 }}</td>
                    <td>{{ detailform.company3 }}</td>
                    <td>{{ detailform.position3 }}</td>
                    <td colspan="4">{{ detailform.leavereason3 }}</td>
                </tr>
                <tr>
                    <td colspan="6"><strong>备注</strong></td>

                </tr>
                <tr>

                    <td colspan="6">{{ detailform.remarks }}</td>
                </tr>
            </table>

        </el-dialog>
    </div>
</template>
  
<script>
import { listTalentpool, getTalentpool, delTalentpool, addTalentpool, updateTalentpool, become } from "@/api/business/talentpool";

export default {
    name: "talentPoolList",
    data() {
        return {
            // 按钮loading
            buttonLoading: false,
            // 遮罩层
            loading: true,
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // 员工表格数据
            talentpoolList: [],
            // 弹出层标题
            title: "",
            // 是否显示弹出层
            open: false,
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                fullName: undefined,
                department: undefined,
                position: undefined,
                age: undefined,
                gender: undefined,
                ethnicity: undefined,
                idNumber: undefined,
                homeAddress: undefined,
                residentialAddress: undefined,
                contactNumber: undefined,
                emergencyContactPerson: undefined,
                emergencyContactNumber: undefined,
                education: undefined,
                major: undefined,
                ruralMedicalInsurance: undefined,
                accommodation: undefined,
                roomNumber: undefined,
                secondemployment: undefined,
                img: undefined,
                remarks: undefined
            },
            // 表单参数
            form: {},
            // 表单校验
            rules: {

                fullName: [
                    { required: true, message: "姓名不能为空", trigger: "blur" }
                ],
                department: [
                    { required: true, message: "部门不能为空", trigger: "blur" }
                ],
                position: [
                    { required: true, message: "岗位不能为空", trigger: "blur" }
                ],
                age: [
                    { required: true, message: "年龄不能为空", trigger: "blur" }
                ],
                gender: [
                    { required: true, message: "性别不能为空", trigger: "blur" }
                ],
                ethnicity: [
                    { required: true, message: "民族不能为空", trigger: "blur" }
                ],
                idNumber: [
                    { required: true, message: "身份证号码不能为空", trigger: "blur" }
                ],


                education: [
                    { required: true, message: "学历不能为空", trigger: "blur" }
                ],

                ruralMedicalInsurance: [
                    { required: true, message: "是否缴纳农村医疗保险不能为空", trigger: "blur" }
                ],
                accommodation: [
                    { required: true, message: "是否住宿不能为空", trigger: "blur" }
                ]
            },
            becomeopen: false,
            becomeform: {
                outsource: "否"
            },
            detailopen: false,
            detailform: {

            }
        };
    },
    created() {
        this.getList();
    },
    methods: {
        /** 查询员工列表 */
        getList() {
            this.loading = true;
            listTalentpool(this.queryParams).then(response => {
                this.talentpoolList = response.rows;
                this.total = response.total;
                this.loading = false;
            });
        },
        // 取消按钮
        cancel() {
            this.open = false;
            this.reset();
        },
        // 表单重置
        reset() {
            this.form = {
                id: undefined,
                fullName: undefined,
                department: undefined,
                position: undefined,
                age: undefined,
                gender: undefined,
                ethnicity: undefined,
                idNumber: undefined,
                homeAddress: undefined,
                residentialAddress: undefined,
                contactNumber: undefined,
                emergencyContactPerson: undefined,
                emergencyContactNumber: undefined,
                education: undefined,
                major: undefined,
                ruralMedicalInsurance: undefined,
                accommodation: undefined,
                roomNumber: undefined,
                createBy: undefined,
                createTime: undefined,
                updateBy: undefined,
                updateTime: undefined,
                delFlag: undefined,
                secondemployment: undefined,
                img: undefined,
                remarks: undefined
            };
            this.resetForm("form");
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.handleQuery();
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
            this.ids = selection.map(item => item.id)
            this.single = selection.length !== 1
            this.multiple = !selection.length
        },
        /** 新增按钮操作 */
        handleAdd() {
            this.reset();
            this.open = true;
            this.title = "添加员工";
        },
        /** 修改按钮操作 */
        handleUpdate(row) {
            this.loading = true;
            this.reset();
            const id = row.id || this.ids
            getTalentpool(id).then(response => {
                this.loading = false;
                this.form = response.data;
                this.open = true;
                this.title = "修改员工";
            });
        },
        //转正
        handleBecome(row) {
            this.becomeopen = true;
            this.ids = row.id;

            //this.becomeform=row;
        },
        handleDetail(row) {
            this.detailopen = true;
            this.detailform = row;
        },
        submitbecomeForm() {
            this.becomeform.id = this.ids;
            this.$modal.confirm('确认转入？').then(() => {
                this.loading = true;
                become(this.becomeform).then(response => {
                    this.$modal.msgSuccess("转入成功");
                    this.becomeopen = false;
                    this.getList();
                }).finally(() => {
                    this.loading = false;
                });
            }).then(() => {
                // this.getList();
                // this.$modal.msgSuccess("转入成功");
            }).catch(() => {
            }).finally(() => {
                this.loading = false;
            });
        },
        /** 提交按钮 */
        submitForm() {
            this.$refs["form"].validate(valid => {
                if (valid) {
                    this.buttonLoading = true;
                    if (this.form.id != null) {
                        updateTalentpool(this.form).then(response => {
                            this.$modal.msgSuccess("修改成功");
                            this.open = false;
                            this.getList();
                        }).finally(() => {
                            this.buttonLoading = false;
                        });
                    } else {
                        addTalentpool(this.form).then(response => {
                            this.$modal.msgSuccess("新增成功");
                            this.open = false;
                            this.getList();
                        }).finally(() => {
                            this.buttonLoading = false;
                        });
                    }
                }
            });
        },
        /** 删除按钮操作 */
        handleDelete(row) {
            const ids = row.id || this.ids;
            this.$modal.confirm('是否确认删除员工编号为"' + ids + '"的数据项？').then(() => {
                this.loading = true;
                return delTalentpool(ids);
            }).then(() => {
                this.loading = false;
                this.getList();
                this.$modal.msgSuccess("删除成功");
            }).catch(() => {
            }).finally(() => {
                this.loading = false;
            });
        },
        /** 导出按钮操作 */
        handleExport() {
            this.download('business/talentpool/export', {
                ...this.queryParams
            }, `talentpool_${new Date().getTime()}.xlsx`)
        }
    }
};
</script>
<style>
/* 基本样式 */
.table {
    border-collapse: collapse;
    width: 100%;
    font-family: Arial, sans-serif;
    text-align: center;
    /* 将表格中的文本内容居中显示 */
}

/* 表头样式 */
.table th {
    background-color: #4CAF50;
    color: white;
}


/* 单元格内边距和边框 */
.table th,
.table td {
    padding: 8px;
    border: 1px solid #ddd;
}

/* 鼠标悬停效果 */
.table tr:hover {
    background-color: #ddd;
}

.bold-text {
    font-weight: bold;
}
</style>